'use strict';

/**
 * @ngdoc directive
 * @name App.directive:echarts
 * @description
 * # echarts
 */
angular.module('App')
  .directive('basicLine', function ($timeout) {
    return {
      restrict: 'A',
      scope: {
        height: '@',
        text: '@',
        subtext: '@',
        yAxisFormatter: '@',
        legend: '=',
        xAxisData: '=',
        seriesData: '='
      },
      link: function postLink(scope, element, attrs) {
        element.css({"height": scope.height || 400});

        var data = [];

        for(var i = 0, j = scope.legend.length; i < j; i++) {
          data.push({
            name: scope.legend[i],
            type:'line',
            data: scope.seriesData[i],
            markPoint: {
              data: [
                {type: 'max', name: '最大值'},
                {type: 'min', name: '最小值'}
              ]
            },
            markLine: {
              data: [
                {type: 'average', name: '平均值'}
              ]
            }
          });
        }

        var option = {
          title: {
            text: scope.text,
            subtext: scope.subtext
          },
          tooltip: {
            trigger: 'axis'
          },
          legend: {
            data: scope.legend,
            left: 'right'
          },
          calculable: true,
          xAxis: [
            {
              type: 'category',
              boundaryGap: false,
              data: scope.xAxisData
            }
          ],
          yAxis: [
            {
              type: 'value',
              axisLabel: {
                formatter: '{value} ' + scope.yAxisFormatter
              }
            }
          ],
          series: data
        };

        echarts.init(element[0]).setOption(option);
      }
    };
  });
